.about-us{
    width: 100%;
    position: relative;
    .left{
        position: absolute;
        top: 0;
        left: 0;
        margin: 0;
        width: 320px;
        background: #000;
        .wrapper{
            margin: auto;
            padding: 60px 30px;
                h2{
                    font-size: 18px;
                    color: #fff;
                    margin-bottom:20px ;
                }
                .details{
                    
                    p{
                        text-align:left;
                        font-size: 14px;
                        color: #999;
                        a{
                            color:#03B3E3 ;
                        }
                    }
                }
                .userful{
                    margin-top: 80px;
                    ul{
                        li{
                            padding: 10px 0;
                            i{
                                position: absolute;
                                width: 12px;
                                height: 20px;
                                display: inline-block;
                                background: url(../img/arrows.png) no-repeat;
                            }
                            .icon-one{
                                
                                background-position: -40px 0px;
                            }
                            .icon-two{
                                display: none;
                                background-position: -57px 0px;
                            }
                            a{
                                display: inline-block;      
                                font-size: 14px;
                                color: #9EA2AE;
                                margin: 0 0 0 30px;
                            }
                            &:hover a{
                                color:#03B3E3 ;
                            }
                            &:hover .icon-one{
                                display: none;
                            }
                            &:hover .icon-two{
                                display: block;
                            }
                            &:last-child{
                            border-bottom: none;
                            }
                        }
                    }
                }
                .search{
                    margin-top: 50px;
                    input{
                        border: none;
                        padding: 15px 0;
                        width: 250px;
                        background: #000;
                        border-bottom:1px solid #999;
                        margin-bottom: 40px;
                    }
                    span{
                        width: 22px;
                        height: 20px;
                        display: block;
                        background: url(../img/arrows.png)-3px 0 no-repeat;
                    }
                }
        }
    }
    .right{
        width: 100%;
        .inner{
            
            background:#25292C;
            max-width: 1040px;
            height: 990px;
            margin-left: 320px;
        }
    }
@media only screen and (max-width:768px){
    .left{
        position: relative;
        width: 100%;
    }
    .right{
        
        .inner{
            width: 100%;
            margin-left: 0;
        }
    }
} 
}
